@charset "utf-8";
/* CSS Document */
@import url('animate.min.css');
html {font-size: 62.5%;}
@media only screen and (min-width: 481px){
html {font-size: 110%!important;}
}
@media only screen and (min-width: 561px){
html {font-size: 109%!important;}
}
@media only screen and (min-width: 641px){
html {font-size: 125%!important;}	
}
body{font-size:13px;font-size:1.1rem ; /*12÷10=1.2*/}
body { font-family: "Microsoft Yahei", "宋体", Tahoma, 'Simsun', Arial, Helvetica, sans-serif; color: #555; background:#f1f1f1; margin: 0px; font-size:1.1rem; line-height: 24px;padding: 0px;}
@media (max-width:1000px) {
body{padding: 0 0 3rem 0;}}
a{ font-family:"Microsoft Yahei", "宋体", Tahoma, 'Simsun', Arial, Helvetica, sans-serif; text-decoration: none; color: #555; font-size: 1.2rem;}
article,aside,details,figcaption,figure,footer,header,hgroup,nav,section,menu{ display: block; margin: 0px;}
a:hover {font-family:"Microsoft Yahei", "宋体", Tahoma, 'Simsun', Arial, Helvetica, sans-serif;  text-decoration: none; color: #000;-webkit-transition: all .4s ease-in-out; -moz-transition: all .4s ease-in-out; -ms-transition: all .4s ease-in-out; -o-transition: all .4s ease-in-out; transition: all .4s ease-in-out; }
h1,h2,h3,h4,h5,h6{display:block;padding:0px;margin: 0px;color:#555;font-family:"Microsoft Yahei", "宋体", Tahoma, 'Simsun', Arial, Helvetica, sans-serif;}
p,ul,ol,li,form,img,dl,dt,dd,em,i{margin:0;padding:0;border:0;font-size:13px;font-family:"Microsoft Yahei", "宋体", Tahoma, 'Simsun', Arial, Helvetica, sans-serif;}
em,i { font-style: normal; }
s{text-decoration: none;}
img{ border: 0px !important; }
input,button,select { margin: 0; font-size: 13px; vertical-align: middle; outline: none;font-family:"Microsoft Yahei", "宋体", Tahoma, 'Simsun', Arial, Helvetica, sans-serif; }
dl,dt,ul,ol { margin: 0px; display: block; padding: 0px; list-style: none; }
h1 { }
h2 { padding: 0px;  display: block; font-weight: normal; }
h3 { padding: 0px; margin: 0px; display: block; }
h4 {padding: 0px; margin: 0px; display: block; }
h5 { }
h6 { }
.scroll{width:30px;height:30px; padding:10px;position:fixed;right:10px;bottom:60px;cursor:pointer; color:#008f62; font-size:14px; line-height:16px;}
.scroll s{display:block; width:30px; height:20px;background:url(../images/huadong.png) no-repeat 0 0; margin:0 auto;}

@media (max-width:1366px) {
	body{font-size: 1rem;}
	a{font-size: 1rem;}
	p,ul,ol,li,form,img,dl,dt,dd,em,i{font-size: 1rem;}
.scroll{display:none;}

}

.img_fd img{width:100%;overflow-x: hidden; overflow-y: hidden; position: relative; z-index: 1; transition-delay: 0s; transition-duration: 1s; transition-property: all; transition-timing-function: ease; /* Firefox 4 */-moz-transition-delay: 0s; -moz-transition-duration: 1s; -moz-transition-property: all; -moz-transition-timing-function: ease; /* Safari 和 Chrome */
-webkit-transition-delay: 0s; -webkit-transition-duration: 1s; -webkit-transition-property: all; -webkit-transition-timing-function: ease; /* Opera */
-o-transition-delay: 0s; -o-transition-duration: 1s; -o-transition-property: all; -o-transition-timing-function: ease;}
.img_fd:hover img{transform: scale(1.2, 1.2); -ms-transform: scale(1.2, 1.2); 	/* IE 9 */ -moz-transform: scale(1.2, 1.2); 	/* Firefox */ -webkit-transform: scale(1.2, 1.2); /* Safari 和 Chrome */ -o-transform: scale(1.2, 1.2); 	/* Opera */opacity:0.6; }
.jbxg{-webkit-transition: all .4s ease-in-out; -moz-transition: all .4s ease-in-out; -ms-transition: all .4s ease-in-out; -o-transition: all .4s ease-in-out; transition: all .4s ease-in-out;}
.im-100 img{display: block; width: 100%;}


.im-fk s .k-t,.k-f,.k-l,.k-r,p{-webkit-transition: all .4s ease-in-out; -moz-transition: all .4s ease-in-out; -ms-transition: all .4s ease-in-out; -o-transition: all .4s ease-in-out; transition: all .4s ease-in-out;z-index: 2;}
.im-fk s .k-t{width: 0%; height: 3px; background: #fff;position: absolute; top: 4%; left: 2%;}
.im-fk s .k-f{width: 0%; height: 3px; background: #fff;position: absolute; bottom: 8%; right: 2%;}
.im-fk s .k-l{width: 3px; height: 0%; background: #fff;position: absolute; top: 4%; right:2%;}
.im-fk s .k-r{width: 3px; height: 0%; background: #fff;position: absolute; bottom: 8%; left: 2%;}
.im-fk s p{display: block; width: 40px;height: 40px; line-height: 40px; font-size: 1.5rem; color: #fff;position: absolute; top: 50%; left: 50%; margin: -220px 0 0 -15px;z-index: 9999;opacity: 0;}


.im-fk:hover s .k-t{width: 96%; height: 2px;}
.im-fk:hover s .k-f{width: 96%; height: 2px;}
.im-fk:hover s .k-l{width: 2px; height: 88%;}
.im-fk:hover s .k-r{width: 2px; height: 88%;}
.im-fk:hover s p{top: 50%; left: 50%; margin: -15px 0 0 -15px;opacity: 1;}

/*top*/
header { position: fixed; top: 0; left: 0; width: 100%; height: 65px; z-index: 9999999999; -webkit-transition: all .5s ease; transition: all .5s ease; padding: 1px 0 }
header .header-wrap { width: 100%; height: 100%; padding: 0 10px; box-sizing: border-box; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between }
header .header-wrap .logo { display: -webkit-box; display: -ms-flexbox; display: flex }
header .header-wrap .logo img { width: 189px; height: 42px }
header .header-wrap .logo .img2 { display: none }
header .header-wrap .logo .img1 { display: block }
header .header-wrap .logo .text { height:42px; line-height: 21px; margin-left: 10px; padding-left: 10px; border-left: 1px dotted #b9b9b9; color: #fff }
header .header-wrap .logo .text p { font-size: 14px; display: block; margin: 0px; padding: 0px;}
header .header-wrap .logo .text p a{color: #fff; font-size: 14px;}
header.active .header-wrap .logo .text p a{color: #555;font-size: 14px;}
header .header-wrap .logo .text p:last-child { padding-top: 0px }
header .header-wrap .nav-wrap { display: -webkit-box; display: -ms-flexbox; display: flex; float:right;}
header .header-wrap .nav-wrap a { color: #fff; font-size: 16px; margin-right: 25px; height: 100%; line-height: 64px; -webkit-transition: all .5s ease;transition: all .5s ease; border-bottom: 3px solid transparent; -webkit-box-sizing: border-  box; box-sizing: border-box }
header .header-wrap .nav-wrap a:last-child { margin-right: 0 }
header .header-wrap .nav-wrap a.active, header .header-wrap .nav-wrap a:hover { border-bottom: 3px solid #f4c51d; -webkit-box-sizing: border-box;
box-sizing: border-box }
header.active { background: #fff; box-shadow: 0 0px 1px #ddd }
header.active .logo .img2 { display: block }
header .menu, header.active .logo .img1 { display: none }
header.active .logo .text p { color: #139eac }
header.active .logo .text p:last-child { color: #555 }

header.active .nav-wrap a { color: #333 }
header .menu-pc { position: fixed; right: 0; top: 50%; margin-top: -155px; width: 50px }
header .menu-pc ul { display: block; margin: 0px; padding: 0px; }
header .menu-pc ul li { width: 100%; height: 50px; background: #01b1b3; color: #fff; display: -webkit-box; display: -ms-flexbox; display: flex;   align-items: center; text-align: center; position: relative; margin-bottom: 2px;}
header .menu-pc ul li a{display: block; width: 100%;}
header .menu-pc ul li img { display: block; margin: 0 auto }
header .menu-pc .back { font-size: 27px; color: #fff; height: 50px; width: 100%; background:#01b1b3; background-size: 34px 23px; cursor: pointer; text-align: center; padding-top: 10px; -webkit-box-sizing: border-box;box-sizing: border-box; position: absolute; left: 0; bottom: -1px; z-index: -1; }
header .menu-pc .back.active { bottom: -51px }
header .menu-pc ul li dl.dianhua{display:none;background: #01888a;width: 160px; height: 50px; line-height: 50px; color: #fff; font-weight: bold; font-size: 16px;position: absolute; left: 0px; top: 0px;opacity: 0;-webkit-transition: all .4s ease-in-out; -moz-transition: all .4s ease-in-out; -ms-transition: all .4s ease-in-out; -o-transition: all .4s ease-in-out; transition: all .4s ease-in-out;}
header .menu-pc ul li:hover dl.dianhua a{color: #fff;font-size: 16px;display: block;}
header .menu-pc ul li:hover dl.dianhua{display: block; opacity: 1; left: -155px;}
header .menu-pc ul li dl.weixin{display:none;background: #01888a; width: 100px; height: 120px;padding: 10px; position: absolute; left: -120px; top: 0px; opacity: 0;}
header .menu-pc ul li dl.weixin span{display: block; height: 30px; line-height: 30px; font-size: 14px; color: #fff; text-align: center;}
header .menu-pc ul li:hover dl.weixin{display: block; opacity: 1; }
header .menu-pc ul li:hover{background: #01888a;}
.menu-button{display: none;}
@media (max-width:1366px) {
.menu-button {display: block;}

header .header-wrap .logo .text, header .header-wrap .nav-wrap, header .menu-pc { display: none }
header { height: 3rem; width: 100% }
header .header-wrap { width: 100%; padding: 0 0.5rem; -webkit-box-sizing: border-box; box-sizing: border-box }
header .header-wrap .logo img { width: 11rem; height: auto;}
header .header-wrap .menu-button { width: 3rem; /*height: 2.5rem; */color: #fff; font-size: 3rem;}
header.active .header-wrap .menu-button {display: block; color: #000;}
header .menu { position: fixed; top: 0; width: 100%; height: 100%; background: #121718; padding: 0 1.7rem; -webkit-box-sizing: border-box;
box-sizing: border-box; -webkit-transition: all .5s ease; transition: all .5s ease; left: 100vw; display: block }
header .menu .hd { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; height: 8rem; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; position: relative }
header .menu .hd .clone { width: 3rem; height: 100%; position: absolute; left: 1.2rem; top: 0; background: url(/skin/default/lowei/images/close.png) no-repeat center; background-size: 100%;}
header .menu .hd img{width: 40%;}
header .menu ul {display: block; padding: 0 1.75rem }
header .menu ul li{ display: block; height: 3.5rem; line-height: 3.5rem; border-bottom: 1px solid #333b3c }
header .menu ul li a{ display: block;font-size: 1.2rem; color: #fff ;}
header .menu.active { left: 0 }
}

/*banner*/
.apple-banner{width:100%;height:100vh; overflow:hidden}
.swiper-container{width:100%;height: 100vh;}
.arrow-left{position:absolute;left:0;top:0;width:15%;height:100%;z-index:999}
.arrow-left span{margin-top:-32px;display:block;left:20px;top:50%;position:absolute;width:64px;height:64px;border-radius:100%;background:rgba(180,180,180,.25) url(../images/arrows.png) no-repeat center 17px;opacity:0;-webkit-transition:opacity .5s ease;transition:opacity .5s ease}
.arrow-left:hover span{opacity:.6}
.arrow-right{position:absolute;right:0;top:0;width:15%;height:100%;z-index:999}
.arrow-right span{margin-top:-32px;display:block;right:20px;top:50%;position:absolute;width:64px;height:64px;border-radius:100%;background:rgba(180,180,180,.25) url(../images/arrows.png) no-repeat center -71px;opacity:0;-webkit-transition:opacity .5s ease;transition:opacity .5s ease}
.arrow-right:hover span{opacity:.6}


.pagination{position:absolute;left:0;text-align:center;bottom:0;width:100%}
.pagination li{display:inline-block;width:50px;height:30px;margin:0 3px;cursor:pointer}
.pagination li span{width:50px;height:2px;display:block;background:#fffc00;}
.pagination li span i{background:#04b4b2;height:2px;display:block;opacity:0}
.pagination .current span i,.pagination .firstCurrent span i{transition:all .5s ease;opacity:1}
.pagination .click span{background:#fff;}
.pagination .click span i{display:none}

.autoplay li span i{transform:scaleX(0);transform-origin:0;opacity:1}
.autoplay .firstCurrent span i{transform:scaleX(1);transition:all 3s linear}
.autoplay .current span i{transform:scaleX(1);transition:all 4s linear}
.autoplay .replace span{background:#04b4b2;}
.autoplay .replace span i{transform:scaleX(0)}


.swiper-slide{position: relative;}
.slide1 .title,.slide2 .title,.slide3 .title{display: block; position: relative; height: 10rem;top: 50%; margin-top: -5rem; padding: 0 10% 0 60%; color: #fff; font-size: 1.4rem;}
.slide1 .title p{display: block; margin: 0px; padding: 1rem 0 0 0px; line-height: 2rem;font-size: 1rem;}
.slide2 .title p{display: block; margin: 0px; padding: 1rem 0 0 0px; line-height: 2rem;font-size: 1rem;}
.slide3 .title p{display: block; margin: 0px; padding: 1rem 0 0 0px; line-height: 2rem;font-size: 1rem;}


.banner-service{width: 25rem;background: #fff; position: absolute; bottom: 0px; right: 0px;padding: 2rem 3rem;}
.banner-service h2{display: block; height: 4rem; line-height: 4rem; font-size: 2.4rem; text-transform: uppercase;}
.banner-service i{display: block; width: 3rem;height: 1px; background: #000;margin: 0 0 0.5rem 0;}
.banner-service p{display: block; margin: 0px; padding: 0px; color: #888;line-height: 1.4rem;}
@media (max-width:1100px) {
	.apple-banner{width:100%; height:16.8rem; overflow:hidden}
    .swiper-container{margin-top:-40px;width:100%;height: 18rem;}
	.swiper-slide{ background-size: 100% !important;}
	.slide1 .title,.slide2 .title,.slide3 .title{display: block; margin-top: -15%;padding-left: 50%; margin-right: 0.5% !important;}
    .banner-service{display: none;}

}
.swiper-container {margin:0 auto;position:relative;overflow:hidden;direction:ltr;-webkit-backface-visibility:hidden;-moz-backface-visibility:hidden;-ms-backface-visibility:hidden;-o-backface-visibility:hidden;backface-visibility:hidden;/* Fix of Webkit flickering */z-index:1;}

.swiper-wrapper {position:relative;width:100%;-webkit-transition-property:-webkit-transform, left, top;-webkit-transition-duration:0s;-webkit-transform:translate3d(0px,0,0);-webkit-transition-timing-function:ease;-moz-transition-property:-moz-transform, left, top;-moz-transition-duration:0s;-moz-transform:translate3d(0px,0,0);-moz-transition-timing-function:ease;-o-transition-property:-o-transform, left, top;-o-transition-duration:0s;-o-transform:translate3d(0px,0,0);-o-transition-timing-function:ease;-o-transform:translate(0px,0px);-ms-transition-property:-ms-transform, left, top;-ms-transition-duration:0s;-ms-transform:translate3d(0px,0,0);-ms-transition-timing-function:ease;transition-property:transform, left, top;transition-duration:0s;transform:translate3d(0px,0,0);transition-timing-function:ease;-webkit-box-sizing: content-box;-moz-box-sizing: content-box;box-sizing: content-box;}

.swiper-free-mode > .swiper-wrapper {-webkit-transition-timing-function: ease-out;-moz-transition-timing-function: ease-out;-ms-transition-timing-function: ease-out;-o-transition-timing-function: ease-out;transition-timing-function: ease-out;margin: 0 auto;}
.swiper-slide {float: left;-webkit-box-sizing: content-box;-moz-box-sizing: content-box;box-sizing: content-box;}
/* IE10 Windows Phone 8 Fixes */
.swiper-wp8-horizontal {-ms-touch-action: pan-y;}
.swiper-wp8-vertical {-ms-touch-action: pan-x;}
/* ===============================================================

Your custom styles, here you need to specify container's and slide's

sizes, pagination, etc.

================================================================*/

.swiper-container {/* Specify Swiper's Size: */



/*width:200px;

height: 100px;*/

}
.swiper-slide {width: 100%;height: 100vh;}
.swiper-slide-active {

/* Specific active slide styling: */

}

.swiper-slide-visible {

/* Specific visible slide styling: */	



}

/* ===============================================================

Pagination Styles

================================================================*/

.swiper-pagination-switch {

/* Stylize pagination button: */	

}

.swiper-active-switch {

/* Specific active button style: */	

}

.swiper-visible-switch {

/* Specific visible button style: */	

}

/*business*/

.index-business{width: 100%;padding: 0.5rem 0px;}
.index-business ul{display:flex; overflow: hidden; justify-content: space-between; -moz-justify-content: space-between;flex-wrap: wrap;-moz-flex-wrap: wrap;}
.index-business ul li{display: block; width: 19.8%; background: #fff;margin-bottom: 0.8rem; -webkit-transition: all .4s ease-in-out; -moz-transition: all .4s ease-in-out; -ms-transition: all .4s ease-in-out; -o-transition: all .4s ease-in-out; transition: all .4s ease-in-out; }
.index-business ul li s{display: block; overflow: hidden;position: relative; }
.index-business ul li s img{display: block;width: 100%;}
.index-business ul li h2{display: block; height: 3rem; line-height: 3rem;position: relative;}
.index-business ul li h2 a{display: block; font-size: 1rem; color: #000;padding: 0 1rem;}
.index-business ul li h2 a i{display:none; width: 2rem; font-size: 0.8rem; color: #fff; position: absolute; right: -2rem; top: 0px; opacity: 0;}
.index-business ul li h2 a:hover{display: block; right: 1rem; opacity: 1;}
.index-business ul li span{display: block;margin: 0px; padding: 0 1rem 1rem 1rem; line-height: 1.6rem; color: #888;}
.index-business ul li:hover{background: #00a9b4; color: #fff;box-shadow: 0 1px 10px #ccc;}
.index-business ul li:hover h2 a{color: #fff;}
.index-business ul li:hover span{color: #fff;}
.index-business ul li:hover s{background: #000;}


.index-title{display: block; font-size: 1.2rem; color: #000; text-align: center;padding-top: 2rem;}
.index-title span{display: block; height: 3rem; line-height: 3rem; font-size: 0.8rem; color: #888;}
.index-tab{display:flex; justify-content: center; -moz-justify-content: center;padding-bottom: 1.5rem;}
.index-tab a{display:inline-block; padding: 0.3rem 1.2rem; background: #fff; color: #000;margin: 0 0.1rem;font-size: 0.7rem; font-weight: normal;}
.index-tab a:hover{background: #00a9b4; color: #fff;}
.index-tab a.hover{background: #00a9b4; color: #fff;}


.index-case{width: 100%;padding: 0.5rem 0px;}
.index-case ul{display:flex; width: 100%; overflow: hidden;justify-content: space-around;-moz-justify-content: space-between;flex-wrap: wrap;-moz-flex-wrap: wrap;}
.index-case ul li{display: block; width:24.95%;padding-bottom: 2.5rem; position: relative; background: #fff;}
.index-case ul li s{display: block;width: 100%; position: relative;overflow: hidden; background: #000;}
.index-case ul li span{display: block;width: 100%; height: 2.5rem; line-height: 2.5rem;position: absolute; bottom: 0px; left: 0px; z-index: 2; -webkit-transition: all .4s ease-in-out; -moz-transition: all .4s ease-in-out; -ms-transition: all .4s ease-in-out; -o-transition: all .4s ease-in-out; transition: all .4s ease-in-out;}
.index-case ul li span i{float: right;}
.index-case ul li span a{display: block;font-size: 0.8rem; padding-left: 1rem;}
.index-case ul li span em{display: inline-block; float: right; text-align: right; color: #888;padding-right: 1rem;font-size: 0.4rem;}
.index-case ul li:hover span{background: #00a9b4; color: #fff; bottom: 0.6rem; width: 96%; left: 2%;}
.index-case ul li:hover span a{color: #fff;}
.index-case ul li:hover span em{color: #fff;}

@media (max-width:1100px) {
	.index-business ul li{display: block; width: 98%; margin: 0 auto;}
	.index-business ul li h2 a{font-size: 1.5rem;}
	.index-case ul li{width: 100%;padding-bottom: 4rem;margin-bottom: 0.6rem;}
	.index-case ul li span{height: 4rem;line-height: 4rem;}
	.index-case ul li span a{font-size: 1.4rem;}
	.index-case ul li span em{font-size: 1rem;}
	.index-tab a{padding: 0.6rem 1.9rem; font-size: 1rem;}

}

/*Brand*/
.Brand{width: 81.6%; margin: 0 auto; display: flex; flex-direction: row; justify-content:space-between;}
.home-title{width: 10%;display: flex;justify-content:flex-end;padding-top: 8rem;}
.home-title span{display:block;width: 3rem;font-size: 1.6rem; writing-mode: vertical-rl;text-transform: uppercase;}
.home-title em{display: block; width: 1rem; font-size: 1rem;}
.home-title em i{display:inline-block; width: 1px; height: 3rem; background: #000;margin-left: 50%;}


.Brand ul{width: 80%;text-align: center;letter-spacing: -6px;padding: 8rem 0;}
.Brand ul>li{display:inline-block; width: 13%; background: #fff;  position:relative; letter-spacing: normal; z-index: 2; vertical-align:top; -webkit-transform:rotate(45deg); -ms-transform:rotate(45deg); -moz-transform:rotate(45deg); transform:rotate(45deg);-webkit-transition: all .4s ease-in-out; -moz-transition: all .4s ease-in-out; -ms-transition: all .4s ease-in-out; -o-transition: all .4s ease-in-out; transition: all .4s ease-in-out;}
.Brand ul>li:nth-child(1){margin: 0px;}
.Brand ul>li:nth-child(2),.Brand ul li:nth-child(3),.Brand ul li:nth-child(4),.Brand ul li:nth-child(5){margin:  0 0 0 6.6%;}
.Brand ul>li:nth-child(6){margin:-3.5% 0 0 10%;}
.Brand ul>li:nth-child(7),.Brand ul li:nth-child(8),.Brand ul li:nth-child(9){margin:  -3.5% 0 0 6.6%}
.Brand ul>li:nth-child(10){margin: 6% 0 0 -81.5%;}
.Brand ul>li:nth-child(11),.Brand ul li:nth-child(12),.Brand ul li:nth-child(13),.Brand ul li:nth-child(14){margin: 6% 0 0 6.6%;}

.Brand ul>li a{position:relative; width: 100%; padding: 100% 0 0 0;}
.Brand ul>li a img{display: block; width: 100%;transform:rotate(-45deg);transform: perspective(800px) rotateY(0deg); transition: all 1s ease 0s; -moz-transform: perspective(800px) rotateY(0deg); -moz-transition: all 1s ease 0s; -webkit-transform: perspective(800px) rotateY(0deg); -webkit-transition: all 1s ease 0s; -o-transform: perspective(800px) rotateY(0deg); -o-transition: all 1s ease 0s; -ms-transform: perspective(800px) rotateY(0deg); -ms-transition: all 1s ease 0s; zoom: 1;-webkit-transform:rotate(-45deg);-ms-transform:rotate(-45deg);-moz-transform:rotate(-45deg);}
.Brand ul>li:hover{background: #00a9b4;}



@media (max-width:1100px) {
.home-title{width: 20%;display: flex;justify-content:flex-end; padding-top: 3rem;}
.home-title span{font-size: 1.2rem;}
.Brand{width: 100%;}
.Brand ul{width: 100%;text-align: center;letter-spacing: -6px;padding: 3rem 0;}
.Brand ul>li{display:inline-block; width: 13%; background: #ccc;  position:relative; letter-spacing: normal; z-index: 2; vertical-align:top; -webkit-transform:rotate(45deg); -ms-transform:rotate(45deg); -moz-transform:rotate(45deg); transform:rotate(45deg);-webkit-transition: all .4s ease-in-out; -moz-transition: all .4s ease-in-out; -ms-transition: all .4s ease-in-out; -o-transition: all .4s ease-in-out; transition: all .4s ease-in-out;}
.Brand ul>li:nth-child(1){margin: 0px;}
.Brand ul>li:nth-child(2),.Brand ul li:nth-child(3),.Brand ul li:nth-child(4),.Brand ul li:nth-child(5){margin:  0 0 0 5.5%;}
.Brand ul>li:nth-child(6){margin:-3.5% 0 0 9.2%;}
.Brand ul>li:nth-child(7),.Brand ul li:nth-child(8),.Brand ul li:nth-child(9){margin: -3.5% 0 0 5.5%;}
.Brand ul>li:nth-child(10){margin:6.1% 0 0 -77.8%;}
.Brand ul>li:nth-child(11),.Brand ul li:nth-child(12),.Brand ul li:nth-child(13),.Brand ul li:nth-child(14){margin: 6.1% 0 0 5.5%;}	
.Brand ul>li a{position:relative;left:0;top:0;width: 100%;padding-top:100%;}


}

.index-about-box{background: #fff; display: flex; justify-content: space-between;}
.index-about-l{width: 6%;display: block;}
.index-about-l .about-l-top{display: block; width: 100%; height: 20.1rem; background: #00a9b4;}
.index-about-in{width: 40%;padding-top: 6.2rem;}
.index-about-in ul{display: flex;padding: 3.6rem 3rem 3.8rem 3rem;height: 10%;}
.index-about-in ul li{display:block; width: 33.3333333%;}
.index-about-in ul li span{display:inline-block;  color: #00a9b4;}
.index-about-in ul li span i{display: inline-block; font-size: 1.4rem;margin: -1rem 0 0 0.5rem;}
.index-about-in ul li p{display:block;}
.index-about-in dl{display:block;width: 96%;height: 12.2rem; background: #f9f9f9;}
.index-about-in dl p{display: block;padding: 3rem 3rem 1.5rem 3rem;font-size: 0.8rem; line-height: 1.6rem;}
.index-about-in dl .about-more{display: inline-block; padding: 0 1.1rem; background: #00a9b4; color: #fff;font-size: 0.6rem; font-weight: bold;}
.index-about-in dl .about-more:hover{background: rgba(253,181,0,1.00);}

.index-about-r{width: 54%; overflow: hidden;padding-top: 7rem;position: relative;}
.index-about-r img{display: block;width: 100%; border: 0px;position: absolute; bottom: 0px;}


.about-title{display: block; height: 4rem; font-size: 1.6rem; text-transform: uppercase;padding: 0 0 0 3rem;}
.about-title span{display: block; font-size: 1rem;}
.about-title span i{display:inline-block; width: 3rem; height: 1px; background: #000;}



@media (max-width:1100px) {
	.about-title{padding: 0 0 0 1rem;}
	.index-about-box{display: block;height: auto;}
	.index-about-l{display: none;}
	.index-about-in{width: 100%;}
	.index-about-in ul{padding: 2.53rem 1rem;}
	.index-about-in dl{width: auto;}
	.index-about-in dl p{padding: 3rem 1rem 1.5rem 1rem;}
	.index-about-r{width: 100%;padding: 0px;}

}

.index-news-box{width: 81.6%; margin: 0 auto; display: flex; flex-direction: row;justify-content: space-between;}
.index-news{display: flex; justify-content: space-between;flex-wrap: wrap; width: 80%;padding: 7rem 0;}
.index-news ul{display: block; width: 32%;}
.index-news ul h3{display: block; height: 3rem; line-height: 3rem; font-size: 1.1rem; color: #000;font-weight: normal;margin-bottom: 1rem;}
.index-news ul h3 i{display: block; width: 2rem; height: 1px; background: #000;margin-top: 0.2rem;}
.index-news ul dl{display: block;margin-bottom: 1rem; overflow: hidden;position: relative;}
.index-news ul dl a{display: block;}
.index-news ul dl a span{display: block; width: 92%;height: 2rem;line-height: 2rem; background:#000; position: absolute; bottom: 0px; left: 0px;padding: 0 4%; color: #fff;font-size: 0.8rem;}
.index-news ul li{height: 2.4rem; line-height: 2.4rem; border-bottom: 1px dotted #ddd;}
.index-news ul li a{font-size: 0.7rem;}



.foot-kf{display: none;}
@media (max-width:1440px) {
	.index-news-box{width: 90%;}

}

@media (max-width:1100px) {
	.index-news-box{width: 100%;}
	.index-news-box h2{display: none;}
	.index-news{padding: 3rem 0 0 0;width: 100%;}
	.index-news ul{width: 100%; margin-bottom: 1rem; padding: 0 0.3rem;}
	.index-news ul li{height: 3rem; line-height: 3rem;}
	.index-news ul li a{font-size: 1.2rem;}

	
.foot-kf{display: block; position: fixed; z-index: 10000; left: 0px; bottom: 0px; width: 100%;height: 3rem; line-height: 3rem;  background: #fff; border-top: 1px solid #139eac;}
.foot-kf ul{display: block;}
.foot-kf ul li{display: block;width: 25%; height: 3rem; float: left;}
.foot-kf ul li a{display: block; border-right: 1px solid #f8f8f8; font-size: 1.2rem; text-align: center;}
.foot-kf ul li.dh400{display: block;width: 50%; height: 3rem; float: left;}
.foot-kf ul li.dh400 a{display: block; color: #fff; background: #139eac;}
}



footer{width: 100%; background: #494e50; padding: 6rem 0px;color: #abacad;}
.foot{width: 81.6%; margin: 0 auto;display: flex; justify-content: space-between;}
.foot s{display: block; width: 18%;background: url(../images/index2019_30.jpg) no-repeat center center; background-size: 100%;}
.foot ul{display:flex; justify-content: space-between; width: 50%;}
.foot ul li{display: block; width: 20%;}
.foot ul li h3{display: block; height: 2.4rem; font-size: 0.8rem;font-weight: normal;color: #abacad;}
.foot ul li h3 i{display: block; background: #abacad; width: 2rem; height: 1px;margin-top: 0.5rem;}
.foot ul li a{display: block; height: 1.4rem; line-height: 1.4rem;font-size: 0.6rem;color: #abacad;}
.foot ul li a:hover{color: #fff;}
.foot dl{display: block; width: 20%;font-size: 1.2rem; color: #abacad;font-size: 0.6rem;line-height: 1.4rem;}
.foot dl strong{font-size: 1rem;display: block; height: 2rem;}


.links{display: block; width: 81.6%; margin: 0 auto;padding-top: 2rem;}
.links h2{display: block; height: 2rem; line-height: 2rem; font-size: 0.8rem;color: #abacad;}
.links ul{display: block; overflow: hidden;}
.links ul li{display: inline-block; float: left;padding: 0 0.5rem;border-right: 1px dotted #abacad;margin-bottom: 0.5rem;}
.links ul li a{font-size: 0.6rem;color: #abacad; }
.links ul li a:hover{color: #fff;}


.bottom{display: block;width: 100%; background: #222; height: 35px; line-height: 35px;font-size: 0.6rem;color:#fff;}
.bottom div{display: block; width: 81.6%; margin: 0 auto;}
.bottom div span{display: inline-block; float: left; margin-right: 10px;}
.bottom div span img{display:inline-block; float: left;width: 15px; margin: 8px 5px 0 0; vertical-align: top;}
.bottom div a{color: #7d8081;font-size: 0.6rem;}
.bottom div a:hover{color: #fff;}
.bottom div p{display: block; width: 350px; margin: 0px; padding: 0px; float: right; text-align: right;font-size: 0.6rem;}
.foot-kf{display: none;}



@media (max-width:1100px){
footer{display: none;}
.bottom{display: block;width: 100%; background: #222; height: auto; line-height: 2rem;padding: 1rem 0;}
.bottom div{display: block; width: 92%; margin: 0 auto;}
.bottom div span{display: inline-block; float: none; margin: 0;}
.bottom div span img{display:inline-block; float: none;width: 15px; margin: 3px 5px 0 0; vertical-align: top;}
.bottom div a{color: #7d8081;}
.bottom div a:hover{color: #fff;}
.bottom div p{display: block; width: 100%; margin: 0px; padding: 0px; float: none; text-align: left;}
	

.foot-kf{display: block; position: fixed; z-index: 10000; left: 0px; bottom: 0px; width: 100%;height: 3rem; line-height: 3rem;  background: #fff; border-top: 1px solid #139eac;}
.foot-kf ul{display: block;}
.foot-kf ul li{display: block;width: 25%; height: 3rem; float: left;}
.foot-kf ul li a{display: block; border-right: 1px solid #f8f8f8; font-size: 1.2rem; text-align: center;}
.foot-kf ul li.dh400{display: block;width: 50%; height: 3rem; float: left;}
.foot-kf ul li.dh400 a{display: block; color: #fff; background: #139eac;}

}

/*in banner*/
.in-banner{width: 100%; height: 39rem;overflow: hidden;}
.in-banner div{width: 1210px; margin: 0 auto;color: #fff;padding: 10rem 0 0 1rem;}
.in-banner div dl{font-size: 2.4rem; line-height: 2rem;}
.in-banner div dl h2{font-size: 1.4rem;color: #fff;padding-top: 10px;}
.in-banner div span{font-size: 14px;color: #fff;display: inline-block; padding-top: 0.1rem;}
.in-banner div span a{font-size: 14px;color: #fff;}



.news-list{width: 81.6%; margin: 0 auto;padding: 2rem 0 3rem 0;}
.news-list ul{display:flex;justify-content:space-between;flex-wrap: wrap; margin: 0; padding: 0px;overflow: hidden;}
.news-list ul li{display: block; background: #fff;width: 21.2% ;padding: 1vw;margin-bottom: 1rem; -webkit-transition: all .6s ease-in-out; -moz-transition: all .6s ease-in-out; -ms-transition: all .6s ease-in-out; -o-transition: all .6s ease-in-out; transition: all .6s ease-in-out;}
.news-list ul li em{display: block; height: 30px; line-height: 30px; font-size: 14px; color: #555;}
.news-list ul li span{display: block; height: 3vw; line-height: 1.5vw; padding: 1rem 0;}
.news-list ul li span a{display: block; font-size: 1rem; color: #000;}
.news-list ul li i{display: block;height: 30px; line-height: 30px; font-size: 12px; color: #999; }
.news-list ul li s{display: block; overflow: hidden;background: #000;}
.news-list ul li p{display: block; padding: 1rem 0px;text-indent: 20px;line-height: 1.6rem;}
.news-list ul li:hover{background: #139eac; color: #fff;}
.news-list ul li:hover span a{ color: #fff;}
.news-list ul li:hover em{ color: #fff;}
.news-list ul li:hover i{ color: #fff;}


a#loadmore{display: block; width: 100%; height:3rem; line-height: 3rem; background: #ddd; text-align: center; font-size:0.7rem;margin: 1rem auto;}

.side-nav{display: block; width: 100%; height: 3rem; line-height: 3rem; background: #fff;}
.side-nav ul{display:flex; margin: 0px auto; padding: 0px;width: 1210px; justify-content:center;-moz-justify-content: center;flex-wrap:wrap;-moz-flex-wrap:wrap;}
.side-nav ul li{display:inline-block;padding: 0 0.8rem; height: 3rem; line-height: 3rem;text-align: center;}
.side-nav ul li a{display: block; font-size: 14px;}
.side-nav ul li a:hover{border-bottom: 2px solid #139eac; color: #139eac;height: 2.9rem;} 
.side-nav ul li a.active{border-bottom: 2px solid #139eac; color: #139eac;height: 2.9rem;} 


@media (max-width:1100px) {
	.wep-nav{display: block;}
	.in-banner{height: 20rem;}
	.in-banner div{padding-top: 8rem;}
	.in-banner div span{display: none;}

	

	.news-list{width: 100%;}
	.news-list ul li{width: 92%; margin: 0 auto 1rem auto;padding: 1rem;}
	.news-list ul li span{height: 4rem; line-height: 2rem;}
	.news-list ul li span a{font-size: 1.6rem;}
	.news-list ul li em{font-size: 1.2rem;}
	.news-list ul li i{font-size: 1rem;line-height: 2rem;}
	.news-list ul li p{line-height: 2.4rem;}
	a#loadmore{width: 96%;}
	

	.side-nav ul{width: 100%;margin: 0;}
	.side-nav ul li{display:inline-block;padding: 0;width:16.66666666%; height: 3rem; line-height: 3rem;text-align: center;}
    .side-nav ul li a{display: block; font-size: 1.2rem;}



}

/*网络营销专题*/

.seo-box{width: 100%; padding: 30px 0px 80px 0px;}
.seo-box.bg{background: #fff;}
.yx-list{margin: 0 auto;display: flex; justify-content: space-between; -moz-justify-content: space-between;flex-wrap: wrap;}
.yx-list s{display: block; width: 50%;}
.yx-list s img{display: block; width: 100%;}
.yx-list dl{display: block; width: 35%;padding-top: 10rem;}
.yx-list dl h2{display: block; height: 80px; line-height: 40px; font-size: 26px; color: #000;font-weight: normal;}
.yx-list dl p{display: block; margin: 0px; padding: 10px 0px; color: #666;line-height: 30px;padding-bottom: 30px;}
.yx-list dl a.more{display: inline-block; box-sizing: border-box; color: #139eac; border: 1px solid #139eac; width: 150px;height: 40px;border-radius: 4px;line-height: 40px; text-align: center;font-size: 0.7rem;}
.yx-list dl a.more:hover {background-color: #139eac; color: #fff; transition: all .5s;}



.main,.yx-list{width: 80%; margin: 0 auto;}
.tg-tuandui{display:flex; justify-content: space-between; -moz-justify-content: space-between;flex-wrap: wrap; margin: 0px; padding: 2rem 0 3rem 0;}
.tg-tuandui li{display: block; width: 24.5%; background: #fff;}
.tg-tuandui li span{display: block; overflow: hidden; position: relative;background: #000;}
.tg-tuandui li span i{display: block; position: absolute; top: 0px; left: 0px; z-index: 2; width: 100%; height: 50%; padding-top: 36%; text-align: center; color: #fff; font-size: 1.2rem; background: rgba(0,0,0,.2);}
.tg-tuandui li p{display: block; padding: 1rem; line-height: 1.2rem; font-size: 0.6rem; color: #555;}



.case-list{padding: 2rem 0px;}
.case-list ul{display:block; width: 101%; overflow: hidden;}
.case-list ul li{display: block; width: 24.35%; padding-bottom: 2.5rem; position: relative; background: #fff; margin: 0 0.5% 0.5% 0;float: left;}
.case-list ul li s{display: block;width: 100%; position: relative;overflow: hidden; background: #000;}
.case-list ul li span{display: block;width: 100%; height: 2.5rem; line-height: 2.5rem;position: absolute; bottom: 0px; left: 0px; z-index: 2; -webkit-transition: all .4s ease-in-out; -moz-transition: all .4s ease-in-out; -ms-transition: all .4s ease-in-out; -o-transition: all .4s ease-in-out; transition: all .4s ease-in-out;}
.case-list ul li span i{float: right;}
.case-list ul li span a{display: block;font-size: 0.8rem; padding-left: 1rem;}
.case-list ul li span em{display: inline-block; float: right; text-align: right; color: #888;padding-right: 1rem;font-size: 0.4rem;}
.case-list ul li:hover span{background: #00a9b4; color: #fff; bottom: 0.6rem; width: 96%; left: 2%;}
.case-list ul li:hover span a{color: #fff;}
.case-list ul li:hover span em{color: #fff;}
.case-list ul:after{content:""; flex: auto;}


.about{width:100%;}
.show-banner{color: #fff; position: relative;}
.show-banner div{display: block; position: absolute; top: 28%; left: 9.2%; width: 81.6%; z-index: 100;}
.show-banner h2{display: block; height: 3rem; line-height: 3rem; font-weight: normal; font-size: 2.4rem;color: #fff;}
.show-banner span{display: block; line-height: 1.4rem;font-size: 0.8rem;}
.show-banner span a{color: #fff;font-size: 0.8rem;}
.show-banner p{display:flex;justify-content:flex-start;padding-top: 1rem;}
.show-banner p a{display: block; width: 2rem; height: 2rem; line-height: 2rem; border-radius: 50%; overflow: hidden; color: #fff; font-size: 2rem; position: relative; text-align: center; margin-right: 10px;}
.show-banner p a i{display:block; width: 2rem; height: 2rem; border-radius: 50%; overflow: hidden;position: absolute; top: 0; left: 0;z-index: 1; opacity: 0;-webkit-transition: all .4s ease-in-out; -moz-transition: all .4s ease-in-out; -ms-transition: all .4s ease-in-out; -o-transition: all .4s ease-in-out; transition: all .4s ease-in-out;}
.show-banner p a:hover{ color:#00a9b4； }
.show-banner p a:hover i{background:#00a9b4; color: #fff; opacity: 1;top: 0; } 
.show-banner img{display: block; width: 100%;}


.show-box{background: #fff; padding: 5%; width: 71.6%; margin: 2rem auto;}
.show-box img{width: 80% !important; height: auto;}

.w73{width: 73.6%; margin: 0 auto;}
.w81{width: 81.6%; margin: 0 auto;}


.show-morelist{display: flex; justify-content: space-between;flex-wrap: wrap; background: #fff; padding: 1.5rem 4%; margin: 2rem auto;}
.show-morelist span{display: block; width: 50%;font-size: 0.8rem;}
.show-morelist span a{color: #888; font-size: 0.8rem;}
.show-morelist span:nth-child(2n){text-align: right;border-left: 1px solid #ddd; width: 49%;}

.Related h2{display: block; height: 3rem; line-height: 3rem; border-bottom: 1px solid #ddd;padding-left: 10px;}
.Related ul{display: flex; justify-content: space-between; -moz-justify-content: space-between; flex-wrap: wrap;-moz-flex-wrap: wrap;padding: 1rem 0.5rem 2rem 0.5rem;}
.Related ul li{display: block; height: 40px;border-bottom: 1px dotted #ddd; line-height: 40px; width: 48%;}
.Related ul li a{font-size: 0.8rem;}
.Related ul li span{display:inline-block;float: right; color: #888;}


.show-title{display: block; line-height:3rem; font-size: 1.2rem;}
.show-title h1{font-size: 1.6rem; font-weight: normal;}
.show-date{display: block; height: 2.4rem; line-height: 2.4rem; color: #888; border-bottom: 1px solid #ddd; margin-bottom: 2rem;}

@media (max-width:1100px){    
    .yx-list{width: 100%;}
    .yx-list s{width: 100%;}
    .yx-list dl{width: 90% !important; padding: 2rem 5% 0 5%;}
    .tg-tuandui li{margin-bottom: 1rem; width: 49%;}
    .tg-tuandui li p{line-height: 1.6rem; font-size: 1rem;}

    .seo-box.bg .yx-list{flex-direction: column-reverse;} 
   
    .case-list ul{width: 100%;}
    .case-list ul li{width: 100%; padding-bottom: 4rem; margin-bottom: 0.6rem;}
	.case-list ul li span{height: 4rem;line-height: 4rem;}
	.case-list ul li span a{font-size: 1.4rem;}
	.case-list ul li span em{font-size: 1rem;}

    
    .show-banner span{display: none;}
    .w81{width: 100%;}
    .show-morelist span{width: 100%;}
    .show-morelist span:nth-child(2n){text-align: left; border: 0px;width: 100%;}
    
    .Related ul li{width: 100%;}
	.Related ul li a{font-size: 1.2rem;}
	.show-box{width: 90%;}
	.w73{width: 100%;}
}
@media (max-width:1366px){
.main,.yx-list{width: 100%; margin: 0px;}

}